.Tag {
  flex-shrink: 0;

  &--s {
    padding: 6px 8px;
  }
  &--m {
    padding: 8px 10px;
  }
  &--l {
    padding: 10px 14px;
  }

  &--default {
    background-color: $duxappPageColor;
  }

  &--primary {
    background-color: $duxappPrimaryColor;
  }

  &--secondary {
    background-color: $duxappSecondaryColor;
  }

  &--success {
    background-color: $duxappSuccessColor;
  }

  &--danger {
    background-color: $duxappDangerColor;
  }

  &--warning {
    background-color: $duxappWarningColor;
  }

  &--custom1 {
    background-color: $duxappCustomColor1;
  }

  &--custom2 {
    background-color: $duxappCustomColor2;
  }

  &--custom3 {
    background-color: $duxappCustomColor3;
  }

  &--plain {
    border-width: 1px;

    &--default {
      border-color: $duxappTextColor2;
    }

    &--primary {
      border-color: $duxappPrimaryColor;
    }

    &--secondary {
      border-color: $duxappSecondaryColor;
    }

    &--success {
      border-color: $duxappSuccessColor;
    }

    &--danger {
      border-color: $duxappDangerColor;
    }

    &--warning {
      border-color: $duxappWarningColor;
    }

    &--custom1 {
      border-color: $duxappCustomColor1;
    }

    &--custom2 {
      border-color: $duxappCustomColor2;
    }

    &--custom3 {
      border-color: $duxappCustomColor3;
    }
  }

  &--round {
    border-radius: 30px;
  }

  &--round-min {
    border-radius: 4px;
  }
}
